<template>
	<view>
		<hd-navbar :back="true" :showHomeIcon="false" :showCartIcon="false" :showInput="false" title="地址管理"></hd-navbar>

		<hd-loading v-if="loading" />
		<view class="">
			<view class="flex border-b-1 border-b-solid border-gray-200 py-30 px-30" v-for="(add,index) in address"
				:key="index">
				<view class="flex-1 flex flex-col justify-center">
					<view class="text-gray-800 font-bold">
						{{add.consignee}}
						{{add.tel}}
					</view>
					<view class="text-sm flex items-center mt-10">
						<u-tag text="默认" size="mini" mode="plain" v-if="add.is_default" class="mr-10" />
						{{add.district}}
						{{add.info}}
					</view>
				</view>
				<view class="text-red-600">
					<navigator :url="`/pages/address/update/update?id=${add.id}`">
						编辑
					</navigator>
				</view>
			</view>
		</view>
		<view class="p-20">
			<u-button type="success" @click="$hd.redirect('/pages/address/add/add')">新增地址</u-button>
		</view>
		<hd-tabbar></hd-tabbar>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	export default {
		data() {
			return {
				loading: true
			}
		},
		async onShow() {
			await this.loadAddress()
			this.loading = false
		},
		computed: {
			...mapState('address', ['address'])
		},
		methods: {
			...mapActions('address', {
				loadAddress: 'load'
			})
		}
	}
</script>

<style>

</style>
